<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/public.css" />
		<link href="css/lx2.css" rel="stylesheet" />
		
	</head>
	<body>
		<select id="mysel">
			<option value="images/bg1.jpg">bj1.jpg</option>
			<option value="images/bg2.jpg">bj2.jpg</option>
			<option value="images/bg2.jpg">bj3.jpg</option>
		</select>
		<div class="all">
			<h1>开始</h1>
		
		<table id="table1">
			
			<tr>
				<td><img src="images/tab1.jpg"></td>
				<td><img src="images/tab2.jpg"></td>
				<td colspan="2"><img src="images/btab1.jpg"></td>
				
			</tr>
			<tr>
				<td><img src="images/tab4.jpg"></td>
				<td><img src="images/tab3.jpg"></td>
				<td colspan="2"><img src="images/btab2.jpg"></td>
				
			</tr>
			<tr>
				<td><img src="images/tab5.jpg"></td>
				<td><img src="images/tab6.jpg"></td>
				<td colspan="2"><img src="images/btab3.jpg"></td>
				
			</tr>
			<tr>
				<td><img src="images/tab8.jpg"></td>
				<td><img src="images/tab7.jpg"></td>
				<td colspan="2"><img src="images/btab4.jpg"></td>
				
			</tr>
			<tr>
				<td colspan="2"><img src="images/btab5.jpg"></td>
				<td><img src="images/tab9.jpg"></td>
				<td><img src="images/tab10.jpg"></td>
			</tr>
		</table>
		<table id="table2">
			<tr>
				<td colspan="2"><img src="images/btab6.jpg"></td>
				<td><img src="images/tab11.jpg"></td>
				<td><img src="images/tab12.jpg"></td>
				<td><img src="images/tab13.jpg"></td>
			</tr>
			<tr>
				<td><img src="images/tab14.jpg"></td>
				<td><img src="images/tab15.jpg"></td>
				<td colspan="2"><img src="images/btab7.jpg"></td>
				
			</tr>
			<tr>
				<td><img src="images/tab16.jpg"></td>
				<td><img src="images/tab17.jpg"></td>
				<td><img src="images/tab18.jpg"></td>
				<td><img src="images/tab19.jpg"></td>
			</tr>
			<tr>
				<td colspan="2"><img src="images/btab8.jpg"></td>
				<td colspan="2"><img src="images/btab9.jpg"></td>
				
			</tr>
			<tr>
				<td><img src="images/tab20.jpg"></td>
				<td><img src="images/tab21.jpg"></td>
				<td><img src="images/tab22.jpg"></td>
				<td><img src="images/tab23.jpg"></td>
			</tr>
		</table>
		</div>
		<script type="text/javascript">
			
			//注册事件，获取要改变的背景图片信息
			var mysel=document.querySelector("#mysel");
			mysel.addEventListener("",function(){
				//console.log(this.selectedIndex);
				//console.log(this.options);
				//console.log(this.options[this.selectedIndex]);
				
				var index=this.selectedIndex;
				var opt = this.options[index];
				var imgsrc = opt.value;
				//console.log(imgsrc);
				
				//使用dom改变背景
				var mybody=document.body;
				mybody.style.backgroundImage="url(" + imgsrc +")";
			});
			
		</script>
	</body>
</html>
